<script>
    const noop = function () {}
    export default {
        name: 'zDropdown',
        render: function (h, context) {
            var props = context.props
            var classes = context.data.class
            var style = context.data.style
            var meunItems = context.children
            var onSelectedHandler = context.listeners['on-selected'] || noop
            var onClickHandler = context.listeners['on-click'] || noop
            var onVisibleChangeHandler = context.listeners['on-visible-change'] || noop
            // 下拉框首选项
            // var preferenceIndex = 0
            var preference = meunItems.find(function (item) {
                // "vue-component-Number-DropdownItem" 是DropdownItem虚拟Dom中的tag
                return /DropdownItem/.test(item.tag)
            })
            var preferenceText = preference.componentOptions.children[0].text
            var preferenceData = preference.componentOptions.propsData.data
            return (
                <div class="ivu-dropdown-wrapper">
                    <a on-click={()=>onSelectedHandler(preferenceData)} class="preference" href="javascript:;">
                        {preferenceText}
                    </a>
                    <dropdown
                        class={classes}
                        style={style}
                        on-on-selected={(data)=>onSelectedHandler(data)}
                        on-on-click={(name)=>onClickHandler(name)}
                        on-on-visible-change={(visible)=>onVisibleChangeHandler(visible)}
                        showIcon={true}
                    >
                        <dropdown-menu slot="list">{meunItems}</dropdown-menu>
                    </dropdown>
                </div>
            )
        },
        functional: true
    }
</script>
